<div class="title">
  <img src="assets/image/title3.png" />
</div>
<div class="box">
    <div class="left">
        <div>
          <h1 class = "questionNum">第 {{questionNum}} / 10 题</h1>
        </div>
        <div>
          <p class = "question">{{question.data.content}}</p>
        </div>
        <form class = "options" action = "">
          <!--让用户即使点击到该单选按钮对应的文字上，也可以选择该单选按钮，使用的就是一个label的一个for属性，把这个for属性指定到radio的id值上即可：-->
          <input type="radio" id="A" name="radio" (click)="getOption('A')"><label for="A">{{question.data.selections[0].sign}}. {{question.data.selections[0].content}}</label><br>
          <input type="radio" id="B" name="radio" (click)="getOption('B')"><label for="B">{{question.data.selections[1].sign}}. {{question.data.selections[1].content}}</label><br>
          <input type="radio" id="C" name="radio" (click)="getOption('C')"><label for="C">{{question.data.selections[2].sign}}. {{question.data.selections[2].content}}</label><br>
          <input type="radio" id="D" name="radio" (click)="getOption('D')"><label for="D">{{question.data.selections[3].sign}}. {{question.data.selections[3].content}}</label><br>
          <!--注意：name值一定要相同才能够单选，要默认选项，加一个属性checked就行了-->
        </form>
        <div class="btn">
          <button (click)="onClickToBack()" value="上一题">上一题</button>
          <button (click)="onClickToSubmit()" value="查看解析">查看解析</button>
          <button (click)="onClickToNext()" value="下一题">下一题</button>
        </div>
        <div >
            <p class="tip" *ngIf="showTip === false?false:true">{{tip}}</p>
        </div>
        <div>
          <p class = "analysis" *ngIf="showAnalysis === false?false:true">题目解析：{{question.data.reason}}</p>
        </div>
      </div>
      
      <div class="right">
        <div>
          <!-- 加载题目时一起加载这张图片 -->
          <img src="http://{{question.data.picture_route}}"/>
        </div>
        
        <div>
          <!-- 加载解析时加载这张图片 src="assets/image/analysis.png"-->
          <img *ngIf="showAnalysis === false?false:true" src="http://{{question.data.answer_picture}}"/>
        </div>
      </div>
</div>

